<template>
  <view class="container create_client">
    <tm-sheet :margin="[24, 20]" :round="3" :shadow="2">
      <view class="cus_item">
        <view class="cus_item_label"><text class="zs_form_required">*</text>客户类型</view>
        <view class="cus_item_value">
          <view class="form_item_tag">
            <view v-for="(item, i) in entityOptions" :class="['zk_item_tag', item.value === form.type ? 'selected' : '' ]" :key="i" @click="() => selectEntity(item)">{{item.label}}</view>
          </view>
        </view>
      </view>
    </tm-sheet>
    <view class="zs_section_title">基础信息</view>
    <tm-sheet :margin="[24, 20]" :round="3" :shadow="2">
      <view class="view_form_item">
        <view class="view_item_label"><text class="zs_form_required">*</text>来源渠道</view>
        <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.sourceChannel)">
          <view v-if="form.source_channel" style="padding-right:10px;">{{form.source_channel_text}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label"><text class="zs_form_required">*</text>客户名称</view>
        <view class="view_item_value">
          <u-input v-model="form.name" maxlength="18" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">行业</view>
        <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.industry)">
          <view v-if="form.industry" style="padding-right:10px;">{{form.industry_text}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">统一社会信用代码</view>
        <view class="view_item_value">
          <u-input v-model="form.credit_code" maxlength="18" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label"><text class="zs_form_required">*</text>客户联系人</view>
        <view class="view_item_value">
          <u-input v-model="form.contact_name" maxlength="18" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_special">
        <view class="special_item">
          <view class="view_item_label"><text class="zs_form_required">*</text>客户联系电话</view>
          <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.contactMobile)">
            <view v-if="form.contact_mobile_style" style="padding-right:10px;color: #999;font-size: 15px;">{{form.contact_mobile_style_text}}</view>
            <view v-else style="color: #999999;padding-right:10px;">请选择</view>
            <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
          </view>
        </view>
        <view class="special_item special_input">
          <view class="view_item_label"></view>
          <view class="view_item_value">
            <u-input v-model="form.contact_mobile" maxlength="18" placeholder="请输入" @change="changeMobile" border="none" inputAlign="right" color="#333" placeholderStyle="color:#999;"></u-input>
          </view>
        </view>
      </view>
      <view class="view_form_special">
        <view class="special_item">
          <view class="view_item_label">其他联系方式</view>
          <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.otherContactWay)">
            <view v-if="form.other_contact_channel" style="padding-right:10px;color: #999;font-size: 15px;">{{form.other_contact_channel_text}}</view>
            <view v-else style="color: #999999;padding-right:10px;">请选择</view>
            <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
          </view>
        </view>
        <view class="special_item special_input">
          <view class="view_item_label"></view>
          <view class="view_item_value">
            <u-input v-model="form.other_contact_value" maxlength="18" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
          </view>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label"><text class="zs_form_required">*</text>跟进人</view>
        <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.followUser)">
          <view v-if="form.follow_user" style="padding-right:10px;">{{form.follow_name}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">客户状态</view>
        <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.status)">
          <view v-if="form.status" style="padding-right:10px;">{{form.status_text}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">到访时间</view>
        <view class="view_item_value view_item_select" @click="() => selectDate(timeType.visit)">
          <view v-if="form.visit_time" style="padding-right:10px;">{{moment(form.visit_time).format('YYYY-MM-DD')}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">渠道联系人</view>
        <view class="view_item_value view_item_select" @click="() => selectPicker(selectType.channelUser)">
          <view v-if="form.channel_contact_id" style="padding-right:10px;">{{form.channel_contact_name}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">预计成交几率</view>
        <view class="view_item_value" style="display: flex; align-items: center; justify-content: flex-end;">
          <u-input v-model="form.per_probability" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
          <text style="color:#8091A4;">%</text>
        </view>
      </view>
    </tm-sheet>
    <view class="zs_section_title">需求信息</view>
    <tm-sheet :margin="[24, 20]" :round="3" :shadow="2">
      <view class="view_form_item">
        <view class="view_item_label">预租面积（㎡）</view>
        <view class="view_item_value view_item_range">
          <u-input v-model="form.pre_lease_area_min" type="digit" placeholder="请输入" customStyle="width: 80px;" border="none" color="#333333" placeholderStyle="color:#999999;"></u-input>
          <view style="padding: 0 6px;color:#8091A4;">至</view>
          <u-input v-model="form.pre_lease_area_max" type="digit" placeholder="请输入" customStyle="width: 80px;" inputAlign="right" border="none" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">预算价格</view>
        <view class="view_item_value">
          <u-input v-model="form.per_lease_price" type="digit" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">专注点</view>
        <view class="view_item_value view_item_select"  @click="() => selectPicker(selectType.concerns)">
          <view v-if="form.follows" style="padding-right:10px;">{{form.follows_text}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">预计入住时间</view>
        <view class="view_item_value view_item_select" @click="() => selectDate(timeType.preSettledTime)">
          <view v-if="form.pre_settled_time" style="padding-right:10px;">{{moment(form.pre_settled_time).format('YYYY-MM-DD')}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">备注</view>
        <view class="view_item_value">
          <u-input v-model="form.remark" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
    </tm-sheet>

    <view class="zs_section_title">推荐房源</view>

    <tm-sheet :margin="[24, 20]" :round="3" :shadow="2">
      <!--       推荐房源列表  -->
      <view class="house_list">
        <view v-for="(item, i) in houseListData" class="house_item" :key="i">
          <view class="house_item_head">
            <view class="house_item_img">
              <tm-image preview :src="`${ASSETS_HOST}/${item.house_resource_imgs}`" :width="210" : height="210"></tm-image>
              <view class="house_img_bg">{{matchDictionaryName(houseTypeOptions, item.type)}}</view>
            </view>
            <view class="house_item_info">
              <image class="discount_img" v-if="item.promotion_label === '1'" src="@/static/img/hot.png"/>
              <image class="discount_img" v-if="item.promotion_label === '1'" src="@/static/img/new.png"></image>
              <image class="discount_img" v-if="item.promotion_label === '1'" src="@/static/img/discount.png"></image>
              <view class="house_info_name">{{item.name}}</view>
              <view class="house_info_site">
                <tm-icon fontSize="24" name="iconfont icon-zukeduan-xiangmu" color="#8091A4"></tm-icon>
                <text class="info_site_item">{{item.city_text}}</text>
                <text class="info_site_item">{{item.district_text}}</text>
                <text class="info_site_item info_site_address">{{item.address}}</text>
              </view>
              <view class="house_info_tag">
                <tm-tag v-for="(cItem, i) in item.around_config_text" text :shadow="0" color="#4A76F7" size="m" :label="item.name"></tm-tag>
              </view>
              <view class="house_info_area">
                <tm-icon fontSize="24" name="iconfont icon-mianji" color="#999999"></tm-icon>
                <view class="area_num">{{item.rental_area}}㎡</view>
                <view class="area_price">{{item.pre_lease_price}}</view>
                <view class="area_price">{{item.price_unit_text}}</view>
              </view>
            </view>
          </view>
          <view class="house_item_btns">
            <view class="house_btn_collect" @click="() => collectHouse(item)">
              <tm-icon fontSize="24" :name="(recommended_listings && recommended_listings[item.id])?'iconfont icon-biaoji':'iconfont icon-quxiaobiaoji'" color="#4A76F7"></tm-icon>
               <view style="margin-left: 5px" class="house_btn_text">{{(recommended_listings && recommended_listings[item.id])? '取消标记' : '标记意向房源'}}</view>
            </view>
            <view class="house_btn_remove" @click="() => removeHouse(item)">
              <tm-icon fontSize="24" name="iconfont icon-shanchu1" color="#EA0000"></tm-icon>
              <view class="house_btn_text" style="margin-left: 5px">移除房源</view>
            </view>
          </view>
        </view>
      </view>
      <up-button type="primary" customStyle="background:#E8F3FF;color: #165DFF;border:none;" @click="addHousingResource">
        <tm-icon fontSize="24" name="iconfont icon-tianjiatuijianfangyuan" color="#165DFF"></tm-icon>
        <text style="padding-left: 10px;">添加推荐房源</text>
      </up-button>
    </tm-sheet>
    <view class="zs_section_title">客户现状</view>

    <tm-sheet :margin="[24, 20]" :round="3" :shadow="2">
      <view class="view_form_item">
        <view class="view_item_label">客户当前位置</view>
        <view class="view_item_value">
          <u-input v-model="form.cur_location" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">当前写字楼</view>
        <view class="view_item_value">
          <u-input v-model="form.cur_office_building"  placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">当前面积</view>
        <view class="view_item_value">
          <u-input v-model="form.cur_area" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">当前价格</view>
        <view class="view_item_value">
          <u-input v-model="form.cur_price" type="digit" placeholder="请输入" border="none" inputAlign="right" color="#333333" placeholderStyle="color:#999999;"></u-input>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">到期时间</view>
        <view class="view_item_value view_item_select" @click="() => selectDate(timeType.curExpire)">
          <view v-if="form.cur_expire" style="padding-right:10px;">{{moment(form.cur_expire).format('YYYY-MM-DD')}}</view>
          <view v-else style="color: #999999;padding-right:10px;">请选择</view>
          <tm-icon fontSize="24" name="iconfont icon-youjiantou"></tm-icon>
        </view>
      </view>
      <view class="view_form_item">
        <view class="view_item_label">迁出意向</view>
        <view class="view_item_value">
          <view class="form_item_tag">
            <view v-for="(item, i) in intentionOptions" :class="['zk_item_tag', item.value === form.cur_intention ? 'selected' : '' ]" :key="i" @click="() => selectIntention(item)">{{item.label}}</view>
          </view>
        </view>
      </view>
    </tm-sheet>
    <view class="cus_footer_btn">
      <up-button type="primary" :disabled="!form.type && !form.source_channel && !form.contact_name && !form.name && !form.contact_mobile && !form.contact_mobile_style && !form.follow_user" shape="circle" text="提交" @click="submitData"></up-button>
    </view>

<!--     选项弹框  -->
    <u-picker :show="pickerData.visible" :columns="columnsData" keyName="label" @confirm="confirmPicker" @cancel="cancelPicker"></u-picker>

<!--    选择时间弹框 -->
    <u-datetime-picker
        :show="timeData.visible"
        v-model="timeData.date"
        mode="date"
        ref="timeRef"
        @confirm="confirmTime"
        @cancel="cancelTime"
    ></u-datetime-picker>
  </view>
</template>
<script setup lang="ts">

import {ASSETS_HOST} from '@/config'
import {ref, reactive} from "vue";
import {channelType, mobileShowOptions, otherContactOptions, customerStatusOptions, entityOptions} from '@/utils/dictionary'
import {getDictionary, createdCustomer, updateCustomer, getZsUserList, channelContactList, getConcerns, customerDetail} from "@/api_request/api";
import {onLoad, onShow} from '@dcloudio/uni-app'
import {each, cloneDeep} from 'lodash'
import moment from 'moment'
import {matchDictionaryName} from '@/utils/utils'
import {houseTypeOptions} from '@/utils/dictionary'


const timeVisible = ref<Boolean>(false)
const form = ref<any>({
  contact_mobile_style: 1,
  contact_mobile_style_text: '显号',
  other_contact_channel_text: '微信',
  other_contact_channel: 1
})
enum selectType {
  sourceChannel, // 渠道来源
  industry, // 行业
  contactMobile, // 客户联系电话
  otherContactWay, // 其他联系方式
  followUser, // 跟进人
  status, // 客户状态
  channelUser, // 渠道联系人
  concerns, // 专注点
}
// 意向
const intentionOptions = ref<any>([
  {value: 1,  label: '有'},
  {value: 0,  label: '无'}
])
enum timeType{
  visit, // 到访时间
  preSettledTime, // 预计入住时间
  curExpire, // 到期时间
}
const timeRef = ref<any>(null)
const timeData = reactive<any>({
  visible: false,
  type: undefined,
  date: ''
})
// 跟进人
const followUsers = ref<any>([])
// 渠道联系人
const channelUsers = ref<any>([])
const columnsData = ref<any>([])

// 房源列表
const houseListData = ref<any>([])

// 行业选项
const industryDatas = ref<any>([])

// 关注点
const concernsList = ref<any>([])
const recommended_listings = ref<any>({})

const selectEntity = (item) => {
  form.value.type = item.value
}
const selectDate = (type) => {
  timeData.visible = true
  timeData.type = type
  if(type === timeType.visit) {
    timeData.date = form.value.visit_time
    return
  }
  if(type === timeType.preSettledTime) {
    timeData.date = form.value.pre_settled_time
    return
  }
  if(type === timeType.curExpire) {
    timeData.date = form.value.cur_expire
  }
}
const cancelTime = () => {
  console.log('jp======',timeData)
  timeData.type = ''
  timeData.visible = false
  timeData.date = ''
  console.log('jp=====1111=',timeRef.value)
  // timeRef.value.close()
}
const confirmTime = (item) => {
  console.log('jp======item',item)
  const {value} = item
  if(timeData.type === timeType.visit) {
    form.value.visit_time = value

  } else if(timeData.type === timeType.preSettledTime) {
    form.value.pre_settled_time = value

  } else if(timeData.type === timeType.curExpire) {
    form.value.cur_expire = value
  }
  timeData.visible = false
  timeData.type = ''
}
const pickerData = reactive<any>({
  visible: false,
  type: undefined
})

const selectPicker = (type) => {
  console.log('jp======type',type)
  pickerData.visible = true
  pickerData.type = type
  console.log('jp=====pickerData.type=',pickerData.type)
  if(type === selectType.sourceChannel){
    columnsData.value = [channelType]
    return
  }
  if(type === selectType.industry) {
    console.log('jp======d111',industryDatas.value)
    columnsData.value = [industryDatas.value]
    console.log('jp======选择行业',columnsData.value)
    return
  }
  if(type === selectType.contactMobile) {
    columnsData.value = [mobileShowOptions]
    return
  }
  if(type === selectType.otherContactWay) {
    columnsData.value = [otherContactOptions]
    return
  }
  if(type === selectType.followUser) {
  //   跟进人
    columnsData.value = [followUsers.value]
    return
  }
  if(type === selectType.status) {
  //  客户状态
    columnsData.value = [customerStatusOptions]
    return
  }
  if(type === selectType.channelUser) {
    columnsData.value = [channelUsers.value]
    return
  }
  if(type === selectType.concerns) {
    columnsData.value = [concernsList.value]
  }
}


const getChannelUser = (id) => {
  channelContactList({channel_id: id,page_num: 1,page_size: 500}).then(res =>{
    console.log('jp======渠道联系人',res)
    each(res.data?.list, (item) => {
      item.label = item.name
    })
    channelUsers.value = res.data?.list
  })
}

const cancelPicker = () => {
  pickerData.type = ''
  pickerData.visible = false
}
const confirmPicker = (item) => {
  console.log('jp=======item',item)
  const row = item.value[0]
  const label = row.label
  const id = row.id
  console.log('jp======pickerData.type === selectType.otherContactWay',pickerData.type)
  if(pickerData.type === selectType.sourceChannel) {
  //   渠道来源处理
    form.value.source_channel_text = label
    form.value.source_channel = id
  //   更新渠道联系人选项  todo
    getChannelUser(id)
  } else if(pickerData.type === selectType.industry) {
  //   选择行业
    form.value.industry_text =label
    form.value.industry = id
  } else if (pickerData.type === selectType.contactMobile) {
    console.log('jp======label',id, label)
    form.value.contact_mobile_style = id
    form.value.contact_mobile_style_text = label
  } else if(pickerData.type === selectType.otherContactWay) {

    form.value.other_contact_channel_text = label
    form.value.other_contact_channel = id
  } else if (pickerData.type === selectType.followUser) {
  //   跟进人
    form.value.follow_name = label
    form.value.follow_user = id
  } else if(pickerData.type === selectType.status) {
    form.value.status_text = label
    form.value.status = id
  } else if(pickerData.type === selectType.channelUser) {
    form.value.channel_contact_name = label
    form.value.channel_contact_id = id
  } else if(pickerData.type === selectType.concerns) {
    form.value.follows_text = label
    form.value.follows = id
  }
  pickerData.type = ''
  pickerData.visible = false
}

onShow(()=>{
  let selectRecommandHourse = uni.getStorageSync("selectHourseAtSelectPage");
  //如果选择了推荐房源，则进行显示
  if (selectRecommandHourse) {
    console.log("selectRecommandHourse.....",selectRecommandHourse)
    uni.removeStorageSync("selectHourseAtSelectPage")
    houseListData.value.push(...selectRecommandHourse)
    selectRecommandHourse.forEach(ele=>{
      recommended_listings.value[ele.id] = 0
    })
  }
})

// 电话号 选择隐号时提交的字段
const submitMobile = ref<any>('')
const changeMobile =(e) =>{
  if(form.value.contact_mobile_style === 2) {
    if(e.length >= 4 && e.length <= 7) {
      const before = e.substr(0, 3)
      if(e.length === 4) {
        submitMobile.value = cloneDeep(e)
      } else{
        let __value = submitMobile.value
        const last = cloneDeep(e[e.length-1])
        submitMobile.value = __value + last
      }

      let newValue = `${before}`
      for(let i = 0; i<e.length -3; i++) {
        newValue+='*'
      }
      form.value.contact_mobile = newValue
    } else {
      let __value = submitMobile.value
      const last = cloneDeep(e[e.length-1])
      submitMobile.value = __value + last
    }
  }
}
//添加推荐房源
const addHousingResource = () =>{
  uni.navigateTo({url: `/subpkg/add_house_resource/index`})
}
const removeHouse = (item) => {
  delete recommended_listings.value[item.id]
  houseListData.value = houseListData.value.filter(ele=> ele.id != item.id)
}

const collectHouse = (item) => {
  if( recommended_listings.value[item.id] === 1){
    recommended_listings.value[item.id] = 0
  }else{
    recommended_listings.value[item.id] = 1
  }
}

const selectIntention = (item) => {
  // 选择意向
  form.value.cur_intention = item.value
}
const submitData = async () => {
// 判断新建还是编辑 todo
  if(!form.value.type) return uni.$showMsg('请选择客户类型')
  if(!form.value.source_channel) return uni.$showMsg('请选择来源渠道')
  if(!form.value.name) return uni.$showMsg('请输入客户名称')
  if(!form.value.contact_name) return uni.$showMsg('请输入客户联系人')
  if(!form.value.follow_user) return uni.$showMsg('请选择跟进人')
  if(!form.value.contact_mobile) return uni.$showMsg('请输入客户联系电话')

//
  const params = {
    ...form.value,
    contact_mobile: form.value.contact_mobile_style === 2 ? submitMobile.value : form.value.contact_mobile
  }
  let res: any
  if(params.id) {
    res = await updateCustomer(params)
  } else {
    // 推荐房源 todo
    params.recommended_listings = recommended_listings.value?JSON.stringify(recommended_listings.value):''
    res = await createdCustomer(params)
  }
  if(res.code === 200) {
    uni.$showMsg('操作成功！')
    uni.setStorageSync("refreshPage",true)
    uni.navigateBack()
    return
  }
  uni.$showMsg(res.message)
}

onLoad((option) => {
  console.log('jp======option',option)
  if(option?.id){
  //   编辑
    customerDetail({id: option.id}).then(res => {
      console.log('jp======客户详情',res)
      const {data} = res
      const channelData = data.source_channel ? channelType.find(item => item.value === data.source_channel) : {}
      form.value = {
        ...data,
        source_channel_text: channelData?.label,
        status_text:  matchDictionaryName(customerStatusOptions, data.status),
        contact_mobile_style_text: matchDictionaryName(mobileShowOptions, data.contact_mobile_style),
        other_contact_channel_text: matchDictionaryName(otherContactOptions, data.other_contact_channel),
      }
    })
  }
  // 行业
  getDictionary({id: 1}).then(res=> {
    console.log('jp=======行业',res)
    each(res.data?.list,(item) => {
      item.label = item.name
    })
    industryDatas.value = res.data?.list
  })
//   跟进人 followUsers todo  ===对接人
  getZsUserList({}).then(res => {
    console.log('jp=======对接人',res)
    const __buttList:any[] = []
    for(const i in res.data) {
      __buttList.push({
        id: i,
        label: res.data[i]
      })
    }
    console.log('jp=======__buttList',__buttList)
    followUsers.value = __buttList
  })
// 关注点
  getConcerns({id: 30}).then(res=> {
    console.log('jp======关注点',res)
    each(res.data?.list, (item) => {
      item.label = item.name
    })
    concernsList.value = res.data?.list
  })
})
</script>

<style lang="scss" scoped>
.create_client{

}
</style>